$(function () {

  // 需求1:点击登陆区域内的去登录 registerBox显示  loginBox隐藏
  $("#loginBox a").on('click', function () {
    $("#registerBox").show()
    $("#loginBox").hide()
  })

  $("#registerBox a").on('click', function () {
    $("#registerBox").hide()
    $("#loginBox").show()
  })



  // 需求2:自定义校验规则
  let form = layui.form
  form.verify({
    // 验证密码 /S 除了空格,空白以外的; /s代表白,包括空格、换行、tab缩进等所有的空白
    pwd: [
      /^[\S]{6,12}$/,
      '密码必须是6-12位,且不能出现空格',
    ],
    // 验证两次输入的密码是否一致
    repwd: function (value) { //value代表的是repassword的值
      let pwd = $('#registerBox [name=password]').val()
      if (value !== pwd) {
        return '输入的两次密码不一致！'
      }

    }
  })

  // 需求3:注册(axios)
  // 导入layer,layer是layui内置的属性
  let layer = layui.layer
  $("#form-reg").on('submit', function (e) {
    e.preventDefault()
    axios({
      method: "POST",
      url: "/api/reguser",
      data: $('#form-reg').serialize()
    }).then(function (res) {
      // 校验
      if (res.data.status !== 0) {
        // return alert(res.data.message)
        return layer.msg(res.data.message, { icon: 2 })
      }
      // alert(res.data.message)
      layer.msg('恭喜您,注册成功!', { icon: 1 })
      // 表单重置
      $("#form-reg")[0].reset()
      // 切换到登陆区域
      $("#registerBox a").click()
    })
  })

  // 需求4:登陆功能
  $("#form-login").on('submit', function (e) {
    e.preventDefault()
    axios({
      method: "POST",
      url: '/api/login',
      data: $('#form-login').serialize()
    }).then(function (res) {
      // console.log(res.data)
      if (res.data.status == 1) {
        return layer.msg(res.data.message);
      }
      layer.msg(res.data.message);
      // 页面跳转到index页面
      location.href = '/index.html'
      // console.log(res.data.token)
      localStorage.setItem('token', res.data.token)
    })
  })

})
